<!DOCTYPE html>

<html >
	<head> 
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />		
		<link rel="stylesheet" href="style.css"/>	
		<title> Boutique </title> 
	</head> 
	
	<body>
		<div id="bloc_page">
			<header>
				<div id="titre_principal">
                    <img src="tod.png" alt="Logo de Zozor" id="logo" />
                   <h1> Boutique </h1> 
                </div>
			
				
				<div id="liens">
					<ul>
						<li><a href="index.html"> Accueil 	</a></li>
						<li><a href="panier.html"> Panier	</a></li>
						<li><a href="#"> Liste des transactions	</a></li>
					</ul>
				</div>
			</header>
		
			
		
			<section>
			<!-- <nav>
				Menu
			</nav> -->
				<form id="myForm">
				<article>
				
					<table>
						<tr>
							<th> Référence </th>
							<th> Nom </th>
							<th> Quantité </th>
							<th> Prix </th>
						</tr>
						
						<tr>
							<td> 1 </td>
							<td> Article 1 </td>
							<td> <input type="number" name="q_art_1" max="10" min="0" value="0" /> </td>
							<td> 5 <input type="hidden" name="prix_art_1" value="5" /></td>
							<td> <input type="button" value="ajouter" OnClick="myForm.total.value=total.value + q_art_1.value * prix_art_1.value)">
						</tr>
						
						<tr>
							<td> 2 </td>
							<td> Article 2 </td>
							<td> <input type="number" name="q_art_2" max="10" min="0" value="0" /> </td>
							<td> 10 <input type="hidden" name="prix_art_2" value="10" /> </td>
						</tr>
						
						<tr>
							<td> 3 </td>
							<td> Article 3 </td>
							<td> <input type="number" name="q_art_3" max="10" min="0" value="0" /> </td>
							<td> 15 <input type="hidden" name="prix_art_3" value="15" /> </td>
						</tr>
						
						<tr>
							<td> 4 </td>
							<td> Article 4 </td>
							<td> <input type="number" name="q_art_4" max="10" min="0" value="0" /> </td>
							<td> 20 <input type="hidden" name="prix_art_4" value="20" /> </td>
						</tr>
					</table>
					
					<table>
						<tr>
							<!--<td> <input type="submit" value="Valider" /> </td>
							<td> <input type="submit" value="Recalculer" /> </td> -->
						</tr>
					</table>
				
				</article>
		
				<aside>
					Total <br />
					<input type="text" name="total" />
				</aside>
				</form>
			</section>
		
		
			<footer>
			
				<div>
				</div>
				
				<div>
				</div>
				
				<div>
				</div>
			
			
			</footer>
		
		
		</div>
		
	</body>
</html>
